<template>
  <div>
      <header>
          <p @click="fun()"> &lt; </p>
          <p class="hep1">注册</p>
          <p></p>
      </header>
      <main>
          <p class="p1">
              <img src="wode/1_02.jpg" alt="">
          </p>
          <p class="p2">
              <input type="text" name="" id="" placeholder="请输入创建的昵称">
          </p>
          <p class="p2">
              <input type="text" name="" id="" placeholder="请输入密码">
          </p>
          <p class="p4">
              <button>确认注册</button>
          </p>

      </main>
  </div>
</template>

<script>
export default {
    methods:{
        fun(){
            this.$router.go(-1)
        }
    }
}
</script>

<style scoped>
    header{
        display: flex;
        height: .5rem;
        justify-content: space-between;
        line-height: .5rem;
        border-bottom: 1px solid #f7f7f7;
    }
    header p{
        width: .5rem;
        text-align: center;
    }
    header .hep1{
        font-weight: 600;
    }
    main{
        box-sizing: border-box;
        padding: 0 .2rem;
        font-size: .14rem;
    }
    main p{
        margin: .3rem 0;
        height: .5rem;
    }
    main .p1{
        text-align: center;
    }
    main .p1 img{
        width: .7rem;
        height: .7rem;
        border-radius: .05rem;
    }
    main .p2{
        border-bottom: 1px solid #fafafa;
    }
    main .p2 input{
        display: block;
        width: 100%;
        height: 100%;
        border: none;
    }
    main .p4 button{
        width: 100%;
        height: 100%;
        background: #dcdcdc;
        border: none;
        border-radius: .1rem;
        color: white;
    }
</style>